import React, { Component } from 'react'
export function Page({ data, number, handle }) {
    // console.log("numbver", number)
    var begin = data.number - 5 > -1 ? data.number - 5 : 0
    var end = data.number + 5 < data.totalPages ? data.number + 5 : data.totalPages
    let pages = [];
    for (var index = begin; index < end; index++) {
        pages.push(<li className={number === index ? "active" : ""} key={index}><a onClick={handle.bind(null, index)}>{index + 1}</a></li>);
    }
    return (
        <nav aria-label="Page navigation">
            <ul className="pagination">
                {data.number - 5 > 0 &&
                    <li><a onClick={() => { handle(0) }}>1</a></li>
                }
                {pages}
                {data.number + 5 < data.totalPages &&
                    <li><a onClick={() => { handle(data.totalPages - 1) }}>{data.totalPages}</a></li>
                }
            </ul>
        </nav>)

} 